﻿{% extends "base.html" %}



{% block css %}
<link rel="stylesheet" href="/static/css/admin.css">

<link rel="stylesheet" href="/static/ztree3/css/bootstrapStyle/bootstrapStyle.css" type="text/css">
{% endblock %}


{% block center %}


<!--头部导航-->
<div class="panel panel-default center-top" style="min-width:1300px;">
  <div class="panel-body">
    <ol class="breadcrumb" style="margin-bottom: 0px;background-color: #FFFFFF;">
      <li><a href="/" style="color: #377CD8;">首页</a></li>
      <li><a href="javascript:;">后台管理</a></li>
      <li class="active">{{ title }}</li>
    </ol>
  </div>
</div>



<!--用户信息-->
<div class="panel panel-default center-top" style="min-width:1300px;">
  <div class="panel-heading">
      <div class="row" style="padding-top:5px;padding-left:10px;">
          <div class="col-sm-6">

              <a href="javascript:;" class="btn btn-sm btn-success" data-toggle="modal" data-target="#permsModal"> 添加权限 </a>

          </div>
      </div>
  </div>
  <div class="panel-body">
      
        <div style="margin-bottom: 10px;">
            <div class="col-sm-12">
                <table class="table table-hover table-bordered">
                  <thead>
                    <tr style="background-color: #f5f5f5;">

                        <th>菜单</th>
                        <th>地址</th>
                        <th>类型</th>
                        <th>操作</th>
                    </tr>
                  </thead>
                  <tbody>
                  {% for one in all_menu_perms %}
                    <tr name="tbody" style="background-color: #1cbba7;">
                      <td><i class="fa fa-list" aria-hidden="true"></i>&nbsp;&nbsp;&nbsp;{{ one.perms_title }}</td>

                      <td>{{ one.perms_url }}</td>

                      <td>{{ one.perms_type }}</td>

                      <td style="padding-left:5px;">

                      </td>
                    </tr>
                    {% for two in  one.two_menu %}
                    <tr name="tbody" style="background-color: rgb(178, 245, 208);">
                      <td style="padding-left: 30px;"><i class="fa fa-list" aria-hidden="true"></i>&nbsp;&nbsp;&nbsp;{{ two.perms_title }}</td>

                      <td>{{ two.perms_url }}</td>

                      <td>{{ two.perms_type }}</td>

                      <td style="padding-left:5px;">

                      </td>
                    </tr>

                      {% for i in  two.perms_info %}
                        <tr name="tbody">
                          <td style="padding-left: 60px;">{{ i.perms_title }}</td>

                          <td>{{ i.perms_url }}</td>

                          <td>{{ i.perms_type }}</td>

                          <td style="padding-left:5px;">
                            <a href="javascript:;" style="text-decoration:none;" name="edit-perms" perms_id="{{ i.perms_id }}" data-toggle="tooltip" data-placement="left" title="修改"><span class="fa fa-pencil"></span> </a>&nbsp;&nbsp;&nbsp;
                            <a href="javascript:;" style="text-decoration:none;" name="del-perms" perms_id="{{ i.perms_id }}" data-toggle="tooltip" data-placement="right" title="删除"><span class="fa fa-trash"></span> </a>

                          </td>
                        </tr>
                        {%endfor %}
                    {%endfor %}


                  {% endfor %}
                  <!--
                  {% for perms in perms_obj %}
                    <tr name="tbody">
                      <td>{{ perms.menus.menu_title }}</td>
                        {% if perms.perms_req == "other" %}
                        <td>{{ perms.perms_url }}</td>
                        {% else %}
                      <td>{{ perms.menus.menu_url }}</td>
                        {% endif %}
                      <td>{{ perms.perms_req }}</td>
                        <td>{{ perms.perms_title }}</td>
                      <td style="padding-left:5px;">
                        <a href="javascript:;" style="text-decoration:none;" name="edit-perms" perms_id="{{ perms.id }}" data-toggle="tooltip" data-placement="left" title="修改"><span class="fa fa-pencil"></span> </a>&nbsp;&nbsp;&nbsp;
                        <a href="javascript:;" style="text-decoration:none;" name="del-perms" perms_id="{{ perms.id }}" data-toggle="tooltip" data-placement="right" title="删除"><span class="fa fa-trash"></span> </a>

                      </td>
                    </tr>
                  {% endfor %}
                  -->
                  </tbody>
                </table>

                <div class="text-right" style="margin-top:-30px;padding-right:9%">
                  <ul class="pagination" id="pagination"></ul>
                </div>


            </div>

        </div>
  </div>
</div>


{% endblock %}


<!-- Modal -->
{% block modal %}

<div class="modal fade" id="permsModal" tabindex="-1" perms="dialog" aria-labelledby="permsModalLabel">
  <div class="modal-dialog" perms="document">
    <div class="modal-content" style="margin-top:135px;">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="permsModalLabel">添加权限</h4>
      </div>
      <div class="modal-body">
          <div class="form-group">
            <label >权限</label>
            <input  class="form-control"  placeholder="描述" id="perms-title">
          </div>

          <div class="form-group">
                <label>操作类型</label>
                <select class="form-control" id="perms-req">
                    <option value="post">增</option>
                    <option value="delete">删</option>
                    <option value="put">改</option>
                    <option value="get">查</option>
                    <option value="other">其他</option>
                </select>
          </div>

          <div class="form-group">
            <label>菜单</label>
            <select class="form-control" id="menus-id">
                {% for i in menu_list %}
                <option value="{{ i.id }}">{{ i.menu_title }}</option>
                {% endfor %}
            </select>
          </div>

          <div class="form-group" style="display:none" id="div-perms">
            <label >地址</label>
            <input class="form-control"  placeholder="/url/" id="perms-url">
          </div>


      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary" id="sub-perms">提交</button>
      </div>
    </div>
  </div>
</div>



<div class="modal fade" id="edit-permsModal" tabindex="-1" perms="dialog" aria-labelledby="edit-permsModalLabel">
  <div class="modal-dialog" perms="document">
    <div class="modal-content" style="margin-top:135px;">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="edit-permsModalLabel">修改权限</h4>
      </div>
      <div class="modal-body">
          <div class="form-group">
            <label >权限</label>
            <input  class="form-control"  placeholder="描述" id="edit-perms-title">
          </div>

          <div class="form-group">
                <label>操作类型</label>
                <select class="form-control" id="edit-perms-req">
                    <option value="post">增</option>
                    <option value="delete">删</option>
                    <option value="put">改</option>
                    <option value="get">查</option>
                    <option value="other">其他</option>
                </select>
          </div>

          <div class="form-group">
            <label>菜单</label>
            <select class="form-control" id="edit-menus-id">
                {% for i in menu_list %}
                <option value="{{ i.id }}">{{ i.menu_title }}</option>
                {% endfor %}
            </select>
          </div>
          <div class="form-group" id="edit-div-perms" style="display: none">
            <label >地址</label>
            <input class="form-control"  placeholder="/url/" id="edit-perms-url">
          </div>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary" id="sub-edit-perms">提交</button>
      </div>
    </div>
  </div>
</div>



{% endblock  %}

{% block js %}
    <script type="text/javascript" src="/static/ztree3/js/jquery.ztree.core.js"></script>
    <script type="text/javascript" src="/static/ztree3/js/jquery.ztree.excheck.js"></script>
    <script type="text/javascript" src="/static/ztree3/js/jquery.ztree.exedit.js"></script>
    <script type="text/javascript" src="/static/js/auth_v2.js"></script>
    <script type="text/javascript" >

        $("#perms-req").change(function(){

            var perms_req = $(this).val();

            if (perms_req == 'other'){
                $("#div-perms").css("display",'block')
            }
            else{
                $("#div-perms").css("display",'none')

            }
        });


        $("#edit-perms-req").change(function(){

            var perms_req = $(this).val();

            if (perms_req == 'other'){
                $("#edit-div-perms").css("display",'block')
            }
            else{
                $("#edit-div-perms").css("display",'none')

            }
        });

    </script>

{% endblock %}


